var login = getCookie('login')
var bdlogin = getCookie('data')
var conten = document.querySelector('#conten')
if (login) {
	$('#login').html(`<span>${login}</span>`)
	$('#regist').html(`<span>退出</span>`)
	$('#regist>span').click(function () {
		setCookie('login', 1, -180)
		location.href = './index.html'
	})
}
if (login) {
	$.ajax({
		url: '/hx/getCarData.php',
		type: 'get',
		data: { username: login },
		success: function (res) {
			res = JSON.parse(res)
			res.forEach((item) => {
				item.status = false
			})
			rander1(res)
			click2(res)
			res = JSON.stringify(res)
			localStorage.setItem('data1', res)
		},
	})
}
if (!login && !bdlogin) {
	var data = []
	rander1(data)
}
if (!login && bdlogin) {
	data = JSON.parse(localStorage.getItem('data'))
	console.log(data)
	data.forEach((item) => {
		item.status = false
	})
	rander1(data)
	click1(data)
}
function rander1(data) {
	var x = data.reduce((pre, item) => {
		return pre + item.num * 1
	}, 0)
	$('#carr>a').html(`购物车(${x})`)
	var str
	if (!data[0]) {
		str = `<span>暂无添加商品<span/>
               <a href="./index.html">马上去购物</a> `
		$('#conten').html(str)
		return
	}
	str = `   <table class="shop ">
            <thead>
                <tr class="nav">
                    <th class="Son1">
                        <input type="checkbox" class="all"
                        ${
							data.every((item) => {
								return item.status
							})
								? 'checked'
								: ''
						}><span>全选</span>
                    </th>
                    <th class="Son2"><span>商品信息</span></th>
                    <th class="Son3">价格(元)</th>
                    <th class="Son4">数量</th>
                    <th class="Son5">小计(元)</th>
                    <th class="Son6">操作</th>
                </tr>
            </thead>
            <tbody class="shopS">
                ${data
					.map(function (item) {
						return `<tr class="shopList" idnumber=${item.id}>
                    <td></td>
                    <td><input type="checkbox" class='check'${
						item.status ? 'checked' : ''
					}/></td>
                    <td class="gdkd">
                        <a href="./detalis.html?id=${item.id}"><img
                                src="${item.img}"
                                alt="" /></a>
                        <a href="">
                            <h6>
                               ${item.name}
                            </h6>
                        </a>
                    </td>
                    <td>￥${item.price / 100}</td>
                    <td>
                        <div class="btn-group" role="group" aria-label="...">
                            <button type="button" class="btn btn-default reduce">-</button>
                            <input type="text" class="btn btn-default" value="${
								item.num
							}" />
                            <button type="button" class="btn btn-default add">+</button>
                        </div>
                    </td>
                    <td class="price">￥ <b>${
						(item.price / 100) * item.num
					}</b></td>
                    <td ><span class="del">删除</span></td>
                </tr>`
					})
					.join('')}
            </tbody>
        </table>
        <div class="bottom">
            <div class="left">
                <input type="checkbox" class="all" 
                        ${
							data.every((item) => {
								return item.status
							})
								? 'checked'
								: ''
						}><label for="">全选</label>
                <span id='alldel'>删除选中的商品</span>
            </div>
            <div class="right">
                <span>已选 <b>${
					data.filter((item) => {
						return item.status
					}).length
				}</b>商品 合计不含运费： <strong>￥${data
		.filter((item) => {
			return item.status
		})
		.reduce((pre, item) => {
			return pre + (item.num * item.price) / 100
		}, 0)}</strong></span>
                <span  class='clear ${
					data.some((item) => {
						return item.status
					})
						? 'active'
						: ''
				}'
                       >去结算</span>
            </div>
        </div>`
	$('#conten').html(str)
}

// console.log(conten)
// 本地购物车点击事件需要进行的操作
function click1(data) {
	conten.onclick = function (e) {
		// console.log(1)
		var e = e || window.event
		if (e.target.classList.contains('all')) {
			data.forEach((item) => {
				item.status = e.target.checked ? true : false
			})
			rander1(data)
		}
		if (e.target.classList.contains('check')) {
			var id = e.target.parentNode.parentNode.getAttribute('idnumber')
			data.forEach((item, index) => {
				if (item.id == id) {
					item.status = e.target.checked ? true : false
				}
			})
			rander1(data)
		}
		if (e.target.classList.contains('del')) {
			var xx = confirm('确定删除商品吗')
			if (!xx) return
			var id = e.target.parentNode.parentNode.getAttribute('idnumber')
			console.log(id)
			data = data.filter((item) => {
				console.log(item.id, id)
				return item.id * 1 != id * 1
			})
			change(data)
			rander1(data)
		}
		if (e.target.id == 'alldel') {
			var xx = confirm('确定删除选中商品吗')
			if (!xx) return
			data = data.filter((item) => {
				return !item.status
			})
			rander1(data)
			change(data)
		}
		if (e.target.classList.contains('reduce')) {
			var id =
				e.target.parentNode.parentNode.parentNode.getAttribute(
					'idnumber'
				)
			var num = e.target.nextElementSibling.value
			if (num == 1) return
			e.target.nextElementSibling.value -= 1
			data.forEach((item) => {
				if (item.id == id) {
					item.num = e.target.nextElementSibling.value
				}
			})
			rander1(data)
			change(data)
		}
		if (e.target.classList.contains('add')) {
			var id =
				e.target.parentNode.parentNode.parentNode.getAttribute(
					'idnumber'
				)
			var num = e.target.previousElementSibling.value
			e.target.previousElementSibling.value =
				1 + e.target.previousElementSibling.value * 1
			data.forEach((item) => {
				if (item.id == id) {
					item.num = e.target.previousElementSibling.value
				}
			})
			rander1(data)
			change(data)
		}
	}
}
// 个人购物车需要进行的操作
function click2(data) {
	conten.onclick = function (e) {
		// console.log(1)
		var e = e || window.event
		if (e.target.classList.contains('all')) {
			data.forEach((item) => {
				item.status = e.target.checked ? true : false
			})
			rander1(data)
		}
		if (e.target.classList.contains('check')) {
			var id = e.target.parentNode.parentNode.getAttribute('idnumber')
			data.forEach((item, index) => {
				if (item.id == id) {
					item.status = e.target.checked ? true : false
				}
			})
			rander1(data)
		}
		if (e.target.classList.contains('del')) {
			var xx = confirm('确定删除商品吗')
			if (!xx) return
			var id = e.target.parentNode.parentNode.getAttribute('idnumber')
			console.log(id)
			data = data.filter((item) => {
				console.log(item.id, id)
				return item.id * 1 != id * 1
			})
			$.ajax({
				url: '/hx/removeCarData.php',
				data: {
					username: login,
					id: id,
				},
			})
			change1(data)
			rander1(data)
		}
		if (e.target.id == 'alldel') {
			var xx = confirm('确定删除选中商品吗')
			if (!xx) return
			var bb = data.filter((item) => {
				return item.status
			})
			bb.forEach((item) => {
				$.ajax({
					url: '/hx/removeCarData.php',
					data: {
						username: item.username,
						id: item.id,
					},
				})
			})
			data = data.filter((item) => {
				return !item.status
			})
			change1(data)
			rander1(data)
		}
		if (e.target.classList.contains('reduce')) {
			var id =
				e.target.parentNode.parentNode.parentNode.getAttribute(
					'idnumber'
				)
			var num = e.target.nextElementSibling.value
			if (num == 1) return
			num = num - 1
			data.forEach((item) => {
				if (item.id == id) {
					item.num = num
				}
			})
			change1(data)
			rander1(data)
			$.ajax({
				url: '/hx/updCarData.php',
				type: 'get',
				data: {
					username: login,
					id: id,
					num: num,
				},
				success: function (res) {
					console.log(res)
				},
			})
		}
		if (e.target.classList.contains('add')) {
			var id =
				e.target.parentNode.parentNode.parentNode.getAttribute(
					'idnumber'
				)
			var num = e.target.previousElementSibling.value
			num = num * 1 + 1
			data.forEach((item) => {
				if (item.id == id) {
					item.num = num
				}
			})
			$.ajax({
				url: '/hx/updCarData.php',
				type: 'get',
				data: {
					username: login,
					id: id,
					num: num,
				},
				success: function (res) {
					console.log(res)
				},
			})
			change1(data)
			rander1(data)
		}
	}
}

// 更改数据
function change(data) {
	localStorage.setItem('data', JSON.stringify(data))
}
function change1(data) {
	console.log(data)
	localStorage.setItem('data1', JSON.stringify(data))
}
